<!DOCTYPE html>
<html>

<head>
    <meta http-equiv="content-type" content="text/html; charset=UTF-8" />
    <meta name="viewport" id="viewport"
        content="width=device-width,initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=no">
    <meta name="format-detection" content="telephone=no" />
    <link href="./assets/css/indent-details.css" rel="stylesheet" type="text/css">
  
    <link href="./assets/css/star-rating.min.css" media="all" rel="stylesheet" type="text/css" />
    <!--核心插件样式-->
    <link rel="stylesheet" href="./assets/css/notiflix.css">

    <!-- jquery  -->
    <script src="./assets/js/jquery.min.js"></script>

    <!-- axios  -->
    <script src="./assets/js/axios.min.js"></script>

    <!-- 提示插件 -->
    <script src="./assets/js/notiflix-1.3.0.min.js"></script>

    <!-- 请求接口封装文件 -->
    <script src="./util/request.js"></script>

    <!-- 评分插件 -->
    <script src="./assets/js/star-rating.min.js" type="text/javascript"></script>

    <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap@5.1.1/dist/css/bootstrap.min.css">
<link href="https://cdn.jsdelivr.net/gh/kartik-v/bootstrap-star-rating@4.1.2/css/star-rating.min.css" media="all" rel="stylesheet" type="text/css" />

</head>

<body>
    <div class="headerbox">
        <div class="header">
            <div class="headerL">
                <a onClick="javascript:history.back(-1)" class="goback"><img src="./assets/images/goback.png" /></a>
            </div>
            <div class="headerC">
                <p>订单评价</p>
            </div>
            <div class="headerR"></div>
        </div>
    </div>
    <div class="clear"></div>
    <div class="h50"></div>
    <div class="clear"></div>
    <div class="near-box">

        <div class="jd-qrdd-bigbox">
            <!--商品地址管理部分-->
            <div class="indent-details-box" style="height:auto;">
                <span class="indent-details-img1"></span>
                <span class="indent-details-text1"></span>
            </div>
            <!--地址部分-->
            <div class="jd-qrdd-a1">
                <span class="qrdd-a1-t1 username">董辉</span>
                <span class="qrdd-a1-t1 mobile">185****5453</span>
                <span class="qrdd-a1-t2">默认</span>
                <div class="qrdd-a1-b1">
                    <span class="qrdd-a1-img1"></span>
                    <span class="qrdd-a1-t3">北京市 海淀区 四环到五环之间 四季青杏石口路5号益园文化创业基地c3区4层</span>
                </div>
                <span class="qrdd-a1-img2"></span>
            </div>
            <!--商品部分-->
            <div class="zjzz-buylist-goods1">

            </div>
            <!--商品金额部分-->
            <div class="indent-details-box2">
                <span class="indent-details-text4 tcolor-grey">订单总价</span>
                <span class="indent-details-text5 tcolor-black">￥0.00</span>
            </div>
            <!--订单编号部分-->
            <div class="indent-details-box3">
                <p>订单编号:201711024866544846</p>
                <p>下单时间:2017-11-01 21:15:23</p>
            </div>
        </div>
    </div>
</body>

</html>
<script>
    Notiflix.Notify.Init();
    Notiflix.Confirm.Init();
    let LoginUser = JSON.parse(localStorage.getItem('LoginUser'));
    if (JSON.stringify(LoginUser) === "{}" || LoginUser == null) {
        Notiflix.Notify.Failure("未登陆，请先去登陆");
        location.href = "login.html"
    }
    const url = new URL(window.location.href);
    let orderid = url.searchParams.get('orderid')
    $(document).ready(function () {
                getOrderInfo()
                $("#input-21f").rating()
                // 订单产品
                let orderproduct = []
                async function getOrderInfo() {
                    let res = await POST({
                        url: '/shop/order/info',
                        params: {
                            busid: LoginUser.id ? LoginUser.id : 0,
                            orderid: orderid
                        }
                    })
                    if (res.code == 1) {
                        let data = res.data
                        $(".username").text(data.business.nickname)
                        $(".indent-details-text1").text(data.status_text)
                        $(".mobile").text(data.business.mobile)
                        $(".qrdd-a1-t3").text(data.business.region + data.address)
                        $(".tcolor-black").text(`￥${data.amount}`)
                        $(".indent-details-box3 p").eq(0).text(`订单编号: ${data.code}`)
                        $(".indent-details-box3 p").eq(1).text(`下单时间: ${data.createtime}`)
                        if (data.info.length > 0) {
                            $(".zjzz-buylist-goods1").html('')
                            orderproduct = data.info
                            data.info.forEach((item) => {
                                let str = `
                    <div class="zjzz-buylist-det">
                        <img src="${item.product.thumbs_text}"/>
                        <div class="zjzz-buylist-gdetail">
                            <span class="zjzz-buylist-gtit1">${item.product.name}</span>
                            <span class="zjzz-buylist-gmoney">
                                <i class="zjzz-buylist-gm1" style="padding-right:10px;">￥${item.total}</i>
                                <i class="zjzz-buylist-gm2">x${item.pronum}</i>
                            </span>
                        </div>
                    </div>
                    <div class="zjzz-buylist-det">
                        <label>评分：</label>
                        <input id="input-21b" value="4" type="text" class="rating" data-min=0 data-max=5 data-step=1 data-size="lg" required title="">
                    </div>
                    `
                                $(".zjzz-buylist-goods1").append(str)
                            })
                        }
                    }
                }
</script>